<template id="Vheader">
    <header class="header">
        <div class="tap iconfont" @click="ashow = !ashow">&#xe601;
            <template>
                <transition name="fade">
                    <div class="tableft">
                        <ul>
                            <li><a href="##">首页</a></li>
                            <li><a href="##">影片</a></li>
                            <li><a href="##">影院</a></li>
                            <li><a href="##">商城</a></li>
                            <li><a href="##">演出</a></li>
                            <li><a href="##">我的</a></li>
                            <li><a href="##">卖座网</a></li>
                        </ul>
                    </div> 
                </transition>
            </template>
        </div>
        <div class="middle"><span>{{title}}</span></div>
        <div class="right">
            <div>深圳</div>
            <div class="iconfont jt">&#xe695;</div>
            <div class="iconfont user">&#xe503;</div>
        </div>
    </header>
</template>
<script>
import tap from './tap.vue';
export default {
    data(){
        return{
            ashow:false
        }
    },
    components: {
        tap,
    },
    computed: {
        title:function () {
            // 在这里是访问不到  main.js 里面定义的 store 这个变量的。
            // return store.state.title
            return this.$store.state.title;
        }
    }
}
</script>
<style>
 .tap{position: relative;}
 /*tab切换*/
    .tableft{width: 210px;background: #282828;position: absolute;z-index: 99999999;}
    ul,li{list-style: none;}
    li{height: 51px;padding-left: 10px;line-height: 51px;border-bottom: 1px dashed #333;}
    li a{text-decoration: none;color: #fff;display: block;height: 51px;}
</style>
